<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <th:block th:include="common/head::head"></th:block>
    <style>
        body {
            padding: 20px;
        }

        .info {
            margin-top: 30px;
        }

        .layui-table-box {
            height: 80px;
        }

        .layui-table-box {
            height: 100%;
        }
    </style>
</head>

<body>
<div>
    <button op="a" class="layui-btn  layui-btn-sm layui-btn-normal" th:href="@{./stack(tag=${tag},copyId=${copyId})}">
        导出堆栈信息
    </button>
    <button op="a" class="layui-btn  layui-btn-sm layui-btn-normal" th:href="@{./ram(tag=${tag},copyId=${copyId})}">
        导出内存信息
    </button>
    <button class="layui-btn  layui-btn-sm layui-btn-normal" id="threadInfos">查看线程</button>
</div>
<div class="info">
    <label>系统内存</label>
    <table class="layui-table" id="tab_ram" lay-filter="tab_ram">
        <thead>
        <tr>
            <th>进程id</th>
            <th>进程名称</th>
            <th>所有者</th>
            <th>使用物理内存</th>
            <th>进程状态</th>
            <th>占用CPU</th>
            <th>占用物理内存</th>
            <th>时间总计</th>
            <th>优先级</th>
            <th>nice值</th>
            <th>使用虚拟内存</th>
            <th>共享内存</th>
        </tr>
        </thead>
        <tbody>
        <tr th:if="${data?.get('process')}">
            <td th:text="${data?.process?.pid}"></td>
            <td th:text="${data?.process?.command}"></td>
            <td th:text="${data?.process?.user}"></td>
            <td th:text="${data?.process?.res}"></td>
            <td th:text="${data?.process?.status}"></td>
            <td th:text="${data?.process?.cpu}"></td>
            <td th:text="${data?.process?.mem}"></td>
            <td th:text="${data?.process?.time}"></td>
            <td th:text="${data?.process?.pr}"></td>
            <td th:text="${data?.process?.ni}"></td>
            <td th:text="${data?.process?.virt}"></td>
            <td th:text="${data?.process?.shr}"></td>
        </tr>
        <tr th:unless="${data?.get('process')}">
            <td colspan=12 style="text-align:center">无数据</td>
        </tr>
        </tbody>
    </table>
</div>

<div class="info" th:if="${data?.get('beanMem')}">
    <label> jvm内存</label>
    <table class="layui-table" style="margin-top: 10px">
        <thead>
        <tr>
            <th>已使用堆内存</th>
            <th>占用堆内存</th>
            <th>已分配堆内存</th>
            <th>已使用非堆内存</th>
            <th>占用非堆内存</th>
            <th>已分配非堆内存</th>
            <th>挂起的对象</th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td th:text="${data?.beanMem?.heapUsed}"></td>
            <td th:text="${data?.beanMem?.heapProportion}"></td>
            <td th:text="${data?.beanMem?.heapCommitted}"></td>
            <td th:text="${data?.beanMem?.nonHeapUsed}"></td>
            <td th:text="${data?.beanMem?.nonHeapProportion}"></td>
            <td th:text="${data?.beanMem?.nonHeapCommitted}"></td>
            <td th:text="${data?.beanMem?.mount}"></td>
        </tr>
        </tbody>
    </table>
</div>

<div class="info">
    <label>端口信息</label>
    <table class="layui-table" style="margin-top: 10px">
        <thead>
        <tr>
            <th>进程id/项目名称</th>
            <th>连接协议</th>

            <th>本地地址</th>
            <th>远程地址</th>
            <th>状态</th>

            <th>接收队列</th>
            <th>发送队列</th>
        </tr>
        </thead>
        <tbody>

        <tr th:each="item : ${data?.netstat}">
            <td th:text="${item?.name}"></td>
            <td th:text="${item?.protocol}"></td>
            <td th:text="${item?.local}"></td>
            <td th:text="${item?.foreign}"></td>
            <td th:text="${item?.status}"></td>
            <td th:text="${item?.receive}"></td>
            <td th:text="${item?.send}"></td>
        </tr>
        <tr th:if="${#lists.isEmpty(data?.netstat)}">
            <td colspan=7 style="text-align:center">无数据</td>
        </tr>
        </tbody>
    </table>
</div>

<div id="div_thread" style="padding:10px;display: none;">
    <table class="layui-table" id="tab_threadInfos" lay-filter="tab_threadInfos" style="margin: 0;"></table>
</div>

</body>
<script type="text/html" id="tem_isInNative">
    {{# if(d.isInNative){ }} 是 {{# }else{ }} 否 {{# } }}
</script>
<script type="text/html" id="tem_isSuspended">
    {{# if(d.isSuspended){ }} 是 {{# }else{ }} 否 {{# } }}
</script>
<script type="text/html" id="tem_status">
    <span title="{{ checkStatus(d.status) }}">{{ d.status }}</span>
</script>

<script type="text/javascript">
    function loadSuccess() {

        $("#threadInfos").on("click", function () {
            layerOpen({
                type: 1,
                title: '查看进程',
                content: $('#div_thread'),
                shade: 0.8,
                area: ['80%', '90%'],
                success: function (layero, index) {
                    loadThread();
                }
            });
        });

        //加载进程列表
        function loadThread() {
            tableRender({
                id: 'tab_threadInfos',
                elem: '#tab_threadInfos',
                url: './threadInfos?tag=[[${tag}]]&copyId=' + getQueryString("copyId"),
                cols: [
                    {field: 'id', title: '线程id', sort: true},
                    {field: 'name', title: '线程名称', sort: true},
                    {field: 'status', title: '线程状态', templet: "#tem_status", sort: true},
                    {field: 'blockedCount', title: '唤醒次数', sort: true},
                    {field: 'blockedTime', title: '运行总时间(毫秒)', sort: true},
                    {field: 'waitedCount', title: '阻塞次数', sort: true},
                    {field: 'waitedTime', title: '阻塞总时间(毫秒)', sort: true},
                    {field: 'isInNative', title: '本地线程', templet: "#tem_isInNative", sort: true},
                    {field: 'isSuspended', title: '是否挂起', templet: "#tem_isSuspended", sort: true}
                ],
                page: true,
                parseData: function (res) { //res 即为原始返回的数据
                    if (res.code == 200 && res.data) {
                        return {
                            "code": res.code, //解析接口状态
                            "msg": res.msg, //解析提示文本
                            "count": res.data.count, //解析数据长度
                            "data": res.data.data //解析数据列表
                        };
                    } else {
                        return {
                            "code": res.code, //解析接口状态
                            "msg": res.msg, //解析提示文本
                            "count": 0, //解析数据长度
                            "data": []
                        };
                    }
                }
            });
        }
    }

    function checkStatus(desc) {
        var data = "运行";
        if ("NEW" == desc) {
            data = "未启动";
        } else if ("RUNNABLE" == desc) {
            data = "运行中";
        } else if ("BLOCKED" == desc) {
            data = "阻塞中";
        } else if ("WAITING" == desc) {
            data = "等待中";
        } else if ("TIMED_WAITING" == desc) {
            data = "指定时间等待";
        } else if ("TERMINATED" == desc) {
            data = "已终止";
        }
        return data;
    }
</script>
</html>